<template>
  <div style="display: inline-block;width: 100%;border: 1px solid rgba(128,128,128,0.2)"
    :style="{
      backgroundColor:appData.theme.background
    }"
  >
    <div style="display: inline-block;width: 100%;padding: 6px 5px"
         :style="{
      backgroundColor:appData.theme.background
    }"
    >

      <div v-if="type==3" style="display: inline-block;color: var(--color-neutral-10);width: 300px;height: 200px;position: relative">
        <div v-if="loading==true" style="width: 100%;height: 100%;padding-left: 150px;padding-top: 100px">
          <div style="display: inline-block;transform: translate(-50%,-50%);color: var(--color-neutral-10);text-align: center">
            <div style="--size: 25px; --dot-size: 3px; --dot-count: 6; --color: var(--color-neutral-10); --speed: 1s; --spread: 60deg;display: inline-block" class="dots">
              <div style="--i: 0;" class="dot"></div>
              <div style="--i: 1;" class="dot"></div>
              <div style="--i: 2;" class="dot"></div>
              <div style="--i: 3;" class="dot"></div>
              <div style="--i: 4;" class="dot"></div>
              <div style="--i: 5;" class="dot"></div>
            </div>
            <br>
            <span>正在获取学校信息</span>
          </div>
        </div>
        <div v-if="!loading && type3.data!=undefined" style="padding: 10px 10px">
          <span style="padding: 3px 3px;border-radius: 3px;background-color: rgb(0,120,215);color: white;font-size: 12px;">推荐学校</span>
          <p style="font-size: 18px;font-weight: bold;margin-top: 5px">{{ type3.data.universityName }}</p>
          <p >位于{{ getSchoolLocationName(type3.data)  }}</p>
          <p >办学类型：{{ type3.data.level  }}</p>
          <p v-if="getSchoolLX(type3.data)!=false">特色：{{ getSchoolLX(type3.data)  }}</p>
          <p >性质：{{ type3.data.school_nature_name  }}</p>
          <p v-if="type3.data.type_name!=''">类别：{{ type3.data.type_name  }}</p>
          <button style="border: 0 !important;padding: 3px 3px;font-size: 12px;margin-top: 3px" @click="async ()=>{
            localStorage.setItem('searchAutoOpen',JSON.stringify(type3.data))
            hideChat('/search')
          }">查看详情</button>
        </div>
        <div v-if="!loading && type3.data==undefined" style="width: 100%;height: 100%;;padding: 10px 10px">
          <div style="display: inline-block;color: var(--color-neutral-10);">
            <span style="padding: 3px 3px;border-radius: 3px;background-color: rgb(0,120,215);color: white;font-size: 12px;">推荐学校</span>
            <p >找不到学校信息</p>
            <p >mark:{{ data }}</p>
          </div>
        </div>
      </div>

      <div v-if="type==4" style="display: inline-block;color: var(--color-neutral-10);width: 300px;height: 160px;position: relative">
        <div v-if="loading==true" style="width: 100%;height: 100%;padding-left: 150px;padding-top: 80px">
          <div style="display: inline-block;transform: translate(-50%,-50%);color: var(--color-neutral-10);text-align: center">
            <div style="--size: 25px; --dot-size: 3px; --dot-count: 6; --color: var(--color-neutral-10); --speed: 1s; --spread: 60deg;display: inline-block" class="dots">
              <div style="--i: 0;" class="dot"></div>
              <div style="--i: 1;" class="dot"></div>
              <div style="--i: 2;" class="dot"></div>
              <div style="--i: 3;" class="dot"></div>
              <div style="--i: 4;" class="dot"></div>
              <div style="--i: 5;" class="dot"></div>
            </div>
            <br>
            <span>正在获取专业信息</span>
          </div>
        </div>
        <div v-if="!loading && type4.data!=undefined" style="padding: 10px 10px">
          <span style="padding: 3px 3px;border-radius: 3px;background-color: rgb(0,120,215);color: white;font-size: 12px;">推荐专业</span>
          <p style="font-size: 18px;font-weight: bold;margin-top: 5px">{{ type4.data.majorName }}</p>
          <p >学制：{{ type4.data.year }}</p>
          <p >学士学位名称：{{ type4.data.degree  }}</p>
          <p v-if="type4.data.sel_adv!=''">科目：{{ type4.data.sel_adv  }}</p>
          <button style="border: 0 !important;padding: 3px 3px;font-size: 12px;margin-top: 3px" @click="async ()=>{
            localStorage.setItem('searchAutoOpenMajor',JSON.stringify(type4.data))
            hideChat('/search')
          }">查看详情</button>
        </div>
        <div v-if="!loading && type4.data==undefined" style="width: 100%;height: 100%;;padding: 10px 10px">
          <div style="display: inline-block;color: var(--color-neutral-10);">
            <span style="padding: 3px 3px;border-radius: 3px;background-color: rgb(0,120,215);color: white;font-size: 12px;">推荐专业</span>
            <p >找不到专业信息</p>
            <p >mark:{{ data }}</p>
          </div>
        </div>
      </div>

      <div v-if="type==5" style="display: inline-block;color: var(--color-neutral-10);width: 300px;height: 312px;position: relative">
        <div v-if="loading==true" style="width: 100%;height: 100%;padding-left: 150px;padding-top: 156px">
          <div style="display: inline-block;transform: translate(-50%,-50%);color: var(--color-neutral-10);text-align: center">
            <div style="--size: 25px; --dot-size: 3px; --dot-count: 6; --color: var(--color-neutral-10); --speed: 1s; --spread: 60deg;display: inline-block" class="dots">
              <div style="--i: 0;" class="dot"></div>
              <div style="--i: 1;" class="dot"></div>
              <div style="--i: 2;" class="dot"></div>
              <div style="--i: 3;" class="dot"></div>
              <div style="--i: 4;" class="dot"></div>
              <div style="--i: 5;" class="dot"></div>
            </div>
            <br>
            <span>正在获取志愿信息</span>
          </div>
        </div>
        <div v-if="!loading && type5.data!=undefined" style="padding: 10px 10px">
          <span style="padding: 3px 3px;border-radius: 3px;background-color: rgb(0,120,215);color: white;font-size: 12px;">推荐志愿</span>
          <p style="font-size: 18px;font-weight: bold;margin-top: 5px">{{ type5.data.majorName }}</p>
          <p >学校名称：{{ type5.data.universityName }}</p>
          <p v-if="type5.data.score1!=0">前一年分数线：{{ type5.data.score1  }}</p>
          <p v-if="type5.data.ranks1!=0">前一年最低位次：{{ type5.data.ranks1  }}</p>
          <p v-if="type5.data.num1!=0">前一年录取人数：{{ type5.data.num1  }}</p>
          <p v-if="type5.data.score2!=0">前二年分数线：{{ type5.data.score2  }}</p>
          <p v-if="type5.data.ranks2!=0">前二年最低位次：{{ type5.data.ranks2  }}</p>
          <p v-if="type5.data.num2!=0">前二年录取人数：{{ type5.data.num2  }}</p>
          <p v-if="type5.data.score3!=0">前三年分数线：{{ type5.data.score3  }}</p>
          <p v-if="type5.data.ranks3!=0">前三年最低位次：{{ type5.data.ranks3  }}</p>
          <p v-if="type5.data.num3!=0">前三年录取人数：{{ type5.data.num3  }}</p>
          <button style="border: 0 !important;padding: 3px 3px;font-size: 12px;margin-top: 3px" @click="async ()=>{
            localStorage.setItem('fillApplicationAutoSearch',JSON.stringify(type5.data))
            hideChat('/fillApplication')
          }">查看详情</button>
        </div>
        <div v-if="!loading && type5.data==undefined" style="width: 100%;height: 100%;padding: 10px 10px">
          <div style="display: inline-block;color: var(--color-neutral-10);">
            <span style="padding: 3px 3px;border-radius: 3px;background-color: rgb(0,120,215);color: white;font-size: 12px;">推荐志愿</span>
            <p >找不到志愿信息</p>
            <p >mark:{{ data }}</p>
          </div>
        </div>
      </div>

      <div v-if="type==6" style="display: inline-block;color: var(--color-neutral-10);width: 300px;height: 135px;position: relative">
        <div v-if="loading==true" style="width: 100%;height: 100%;padding-left: 150px;padding-top: 67.5px">
          <div style="display: inline-block;transform: translate(-50%,-50%);color: var(--color-neutral-10);text-align: center">
            <div style="--size: 25px; --dot-size: 3px; --dot-count: 6; --color: var(--color-neutral-10); --speed: 1s; --spread: 60deg;display: inline-block" class="dots">
              <div style="--i: 0;" class="dot"></div>
              <div style="--i: 1;" class="dot"></div>
              <div style="--i: 2;" class="dot"></div>
              <div style="--i: 3;" class="dot"></div>
              <div style="--i: 4;" class="dot"></div>
              <div style="--i: 5;" class="dot"></div>
            </div>
            <br>
            <span>正在获取志愿表信息</span>
          </div>
        </div>
        <div v-if="!loading && type6.data!=undefined" style="padding: 10px 10px">
          <span style="padding: 3px 3px;border-radius: 3px;background-color: rgb(0,120,215);color: white;font-size: 12px;">推荐志愿表</span>
          <p style="font-size: 18px;font-weight: bold;margin-top: 5px">{{ type6.data.formName }}</p>
          <p >共{{ type6.data['length'] }}个志愿</p>
          <p >由{{ type6.data.userName  }}创建</p>
          <button :disabled="working==true" style="border: 0 !important;padding: 3px 3px;font-size: 12px;margin-top: 3px" @click="async ()=>{

            working = true
            let re = (await tool.axiosPostWithCheckStatus(config.serverURL,'/applicationForm/copy',{
              token:homeData.token,
              fromUserMark:data.userMark,
              toUserMark:homeData.loginedUserInfo.mark,
              name:type6.data.formName
            })).results
            console.log(re)
            localStorage.setItem('fillApplicationShowApplicationForm',re)
            hideChat('/fillApplication')
            working = false
          }">将此志愿表保存为我的志愿表</button>
        </div>
        <div v-if="!loading && type6.data==undefined" style="width: 100%;height: 100%;padding: 10px 10px">
          <div style="display: inline-block;color: var(--color-neutral-10);">
            <span style="padding: 3px 3px;border-radius: 3px;background-color: rgb(0,120,215);color: white;font-size: 12px;">推荐志愿表</span>
            <p >找不到志愿表信息</p>
            <p >userMark:{{ data.userMark + ' name:' + data.name }}</p>
          </div>
        </div>
      </div>

      <div v-if="type==7" style="display: inline-block;color: var(--color-neutral-10);width: 300px;height: 140px;position: relative">
        <div v-if="loading==true" style="width: 100%;height: 100%;padding-left: 150px;padding-top: 70px">
          <div style="display: inline-block;transform: translate(-50%,-50%);color: var(--color-neutral-10);text-align: center">
            <div style="--size: 25px; --dot-size: 3px; --dot-count: 6; --color: var(--color-neutral-10); --speed: 1s; --spread: 60deg;display: inline-block" class="dots">
              <div style="--i: 0;" class="dot"></div>
              <div style="--i: 1;" class="dot"></div>
              <div style="--i: 2;" class="dot"></div>
              <div style="--i: 3;" class="dot"></div>
              <div style="--i: 4;" class="dot"></div>
              <div style="--i: 5;" class="dot"></div>
            </div>
            <br>
            <span>正在获取问题</span>
          </div>
        </div>
        <div v-if="!loading && type7.data!=undefined" style="padding: 10px 10px">
          <span style="padding: 3px 3px;border-radius: 3px;background-color: rgb(0,120,215);color: white;font-size: 12px;">问题</span>
          <p style="font-size: 18px;font-weight: bold;margin-top: 5px">{{ type7.data.title }}</p>
          <p v-if="type7.data.content!=''">{{ type7.data.content  }}</p>
          <p v-if="type7.data.content!=''">{{ JSON.parse(type7.data.images).length  }}个图片</p>
          <button style="border: 0 !important;padding: 3px 3px;font-size: 12px;margin-top: 3px" @click="async ()=>{
            localStorage.setItem('quesionAutoSearch',type7.data.mark)
            hideChat('/qaArea')
          }">查看详情</button>
        </div>
        <div v-if="!loading && type7.data==undefined" style="width: 100%;height: 100%;padding: 10px 10px">
          <div style="display: inline-block;color: var(--color-neutral-10);">
            <span style="padding: 3px 3px;border-radius: 3px;background-color: rgb(0,120,215);color: white;font-size: 12px;">问题</span>
            <p >找不到问题内容</p>
            <p >mark:{{ data }}</p>
          </div>
        </div>
      </div>

      <div v-if="type==8" style="display: inline-block;color: var(--color-neutral-10);width: 300px;height: 200px;position: relative">
        <div v-if="loading==true" style="width: 100%;height: 100%;padding-left: 150px;padding-top: 100px">
          <div style="display: inline-block;transform: translate(-50%,-50%);color: var(--color-neutral-10);text-align: center">
            <div style="--size: 25px; --dot-size: 3px; --dot-count: 6; --color: var(--color-neutral-10); --speed: 1s; --spread: 60deg;display: inline-block" class="dots">
              <div style="--i: 0;" class="dot"></div>
              <div style="--i: 1;" class="dot"></div>
              <div style="--i: 2;" class="dot"></div>
              <div style="--i: 3;" class="dot"></div>
              <div style="--i: 4;" class="dot"></div>
              <div style="--i: 5;" class="dot"></div>
            </div>
            <br>
            <span>正在获取用户信息</span>
          </div>
        </div>
        <div v-if="!loading && type8.data!=undefined" style="padding: 10px 10px">
          <span style="padding: 3px 3px;border-radius: 3px;background-color: rgb(0,120,215);color: white;font-size: 12px;">推荐用户</span><br>
          <v-avatar style="margin-top: 5px" color="rgb(0,120,215)">
            <span v-if="type8.data.avatar==''">{{ tool.getShortName(type8.data.name) }}</span>
            <div v-if="type8.data.avatar!=''"  style="width: 48px;height: 48px;display: inline-block;background-position: center;background-repeat: no-repeat;background-size: cover;"
                 :style="{
                  backgroundImage:'url(' + appData.serverURL + '/download/' + type8.data.avatar + ')'
                }"
            >

            </div>
          </v-avatar>
          <p style="font-size: 18px;font-weight: bold;margin-top: 5px">{{ type8.data.name }}</p>
          <p v-if="type8.data.content!=''">{{ type8.data.email  }}</p>
          <div v-if="type8.data.type==0">
            <p >用户类型：考生</p>
            <p >所在省：{{ type8.data.province  }}</p>
          </div>
          <div v-if="type8.data.type==1">
            <p >用户类型：咨询师</p>
          </div>
          <button style="border: 0 !important;padding: 3px 3px;font-size: 12px;margin-top: 3px" @click="async ()=>{
            if(homeData.loginedUserInfo.mark==type8.data.mark){
              return
            }
            startChat({
              userInfo:type8.data
            })
            hideChat('')
          }">发消息</button>
        </div>
        <div v-if="!loading && type8.data==undefined" style="width: 100%;height: 100%;padding: 10px 10px">
          <div style="display: inline-block;color: var(--color-neutral-10);">
            <span style="padding: 3px 3px;border-radius: 3px;background-color: rgb(0,120,215);color: white;font-size: 12px;">推荐用户</span>
            <p >找不到用户信息</p>
            <p >mark:{{ data }}</p>
          </div>
        </div>
      </div>

    </div>
  </div>
</template>

<script>
import tool from '../utlis/tool'
import config from '../config'
import router from '../router'

export default {
  computed:{
    localStorage(){
      return localStorage
    },
    tool(){
      return tool
    },
    config(){
      return config
    }
  },
  data() {
    return {
      loading:true,
      working:false,
      type3:{
        data:{}
      },
      type4:{
        data:{}
      },
      type5:{
        data:{}
      },
      type6:{
        data:{}
      },
      type7:{
        data:{}
      },
      type8:{
        data:{}
      },
    };
  },
  methods: {
    hideChat(toPage){
      this.$emit('hideChat',toPage)
      if(toPage!=''){
        router.push(toPage)
      }
    },
    getSchoolLX(item){
      let re = ''
      if(item.is985=='是'){
        if(re!='')re+='、'
        re+='985'
      }
      if(item.is211=='是'){
        if(re!='')re+='、'
        re+='211'
      }
      if(item.isQJ=='是'){
        if(re!='')re+='、'
        re+='强基计划'
      }
      if(item.isDualClass=='是'){
        if(re!='')re+='、'
        re+='双一流'
      }
      if(re==''){
        return ''
      }else{
        return re
      }
    },
    getSchoolLocationName(item){
      if(item.city.indexOf(item.p)==-1){
        return item.p + '省' + item.city
      }else{
        return item.city
      }
    },
  },
  async mounted() {
    if(this.type==3){
      let re = await tool.axiosPostWithCheckStatus(config.serverURL,'/chat/cardInfo',{
        token:this.homeData.token,
        type:this.type,
        mark:this.data
      })
      this.type3.data = re.results
    }
    if(this.type==4){
      let re = await tool.axiosPostWithCheckStatus(config.serverURL,'/chat/cardInfo',{
        token:this.homeData.token,
        type:this.type,
        mark:this.data
      })
      this.type4.data = re.results
    }
    if(this.type==5){
      let re = await tool.axiosPostWithCheckStatus(config.serverURL,'/chat/cardInfo',{
        token:this.homeData.token,
        type:this.type,
        mark:this.data
      })
      this.type5.data = re.results
    }
    if(this.type==6){
      let re = await tool.axiosPostWithCheckStatus(config.serverURL,'/chat/cardInfo',{
        token:this.homeData.token,
        type:this.type,
        mark:this.data.userMark,
        name:this.data.name,
      })
      this.type6.data = re.results
    }
    if(this.type==7){
      let re = await tool.axiosPostWithCheckStatus(config.serverURL,'/chat/cardInfo',{
        token:this.homeData.token,
        type:this.type,
        mark:this.data
      })
      this.type7.data = re.results
    }
    if(this.type==8){
      let re = await tool.axiosPostWithCheckStatus(config.serverURL,'/chat/cardInfo',{
        token:this.homeData.token,
        type:this.type,
        mark:this.data
      })
      this.type8.data = re.results
    }
    this.loading = false
  },
  props: {
    appData:undefined,
    data:undefined,
    type:0,
    homeData:undefined,
    startChat:undefined
  }
};
</script>

<style>

</style>